(function () {
    $.fn.extend({
        play() {
            class playImg {
                constructor(el) {
                    this.el = el
                    this.oUl = this.el.find('ul')
                    this.oOl = this.el.find('ol')
                    this.imgIndex = 0
                    this.pointIndex = 0
                    this.inPut()
                    this.autoMove()
                    this.clickHandler()
                    this.mouseHandler()
                }
                inPut() {
                    for (let i = 0; i < $(this.oUl).children().length; i++) {
                        let oLis = $(`<li class='${i == 0 ? 'current' : ''}'></li>`)
                        $(this.oOl).append(oLis)
                    }
                    this.oUl.children().eq(0).clone(true).appendTo(this.oUl)
                }
                move() {
                    if (this.imgIndex > 5) {
                        this.imgIndex = 1
                        this.oUl.css('left', '0px')
                    }
                    if (this.pointIndex > 4) {
                        this.pointIndex = 0
                    }
                    this.oUl.animate({ left: -1920 * this.imgIndex })

                    this.oOl.children().eq(this.pointIndex).addClass('current').siblings().removeClass('current')
                }
                autoMove() {
                    this.timer = setInterval(() => {
                        this.imgIndex++
                        this.pointIndex++
                        this.move()
                    }, 2000)
                }
                mouseHandler() {
                    this.el.mouseenter(() => {
                        clearInterval(this.timer)
                    })
                    this.el.mouseleave(() => {
                        this.autoMove()
                    })
                }
                clickHandler() {
                    let self = this
                    $(this.oOl).children().click(function () {
                        let index = $(this).index()
                        self.imgIndex = index
                        self.pointIndex = index
                        self.move()
                    })
                }

            }
            new playImg(this)
        }
    })
})()
$(function () {
    $('.all').play()
})